<template>
	<div class="page voice">
		<StoreChoice ref="StoreChoice" :current=[] :multipleChoice="false" :hasTotal="false" v-on:listenToStoreSelect="callBack" />
		<div class="scroll-view">
			<customHeader middleTitle="语音播报设置" @leftCallBack="handleBack"/>
			<div class="page-body">
				<ul v-if="canDetctVoice">
					<li @click="openDetectVoiceRightPage">
						<span>播报优化</span>
						<div>
							<i class="zhk-list_rarrow"></i>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<span>语音播报</span>
						<div>
							<mt-switch v-model="switchValue" @change="settingChange"></mt-switch>
						</div>
					</li>
					<li v-if="switchValue">
						<span>设置门店</span>
						<div @click="chooseShopTo">
							<span>{{shopName}}</span>
							<i v-if="isShow" class="zhk-list_rarrow"></i>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<span>试听铃声</span>
						<div @click="testVoiceBroadcast">
							<i class="zhk-bf-svg"></i>
						</div>
					</li>
				</ul>
				<!-- <div class="voice-tip" @click="linkTo">
					常见问题？
				</div> -->
			</div>
		</div>
	</div>
</template>

<script>
import Vue from "vue";
import customHeader from "../../components/header/header";
import { Switch, Toast } from "mint-ui";
import jsBridge from "../../tools/jsBridge.js";
import StoreChoice from "../../components/StoreChoice/StoreChoice";
import config from "../../base/profile/config.json";
Vue.component(Switch.name, Switch);
export default {
  name: "voice",
  data() {
    return {
		isClick:0,
      isShow: true,
      switchValue: false,
      shopName:'选择门店',
      storeName:'',
      settingId:"",
      shopId:"",
      shopIds:"",
	  roleName:"",
	  canDetctVoice:false
    };
  },
  methods: {
	openDetectVoiceRightPage(){
		AppUtil.call(AppUtil.APIS.OPEN_DETECT_VOICE_RIGHT);
	},
	checkVoiceTest(){
		let ua = navigator.userAgent.toLowerCase();
		if (window.APP&&window.APP.AndroidSDK&&(Number(window.APP.AndroidSDK)>=23)&&(ua.indexOf('android') >= 0) && (ua.indexOf('cross-bm') >= 0)) {
			AppUtil.checkNativeApi(AppUtil.APIS.OPEN_DETECT_VOICE_RIGHT,()=>{
				this.canDetctVoice = true;
			});
		}
	},
  	settingChange(){
  		var value = this.switchValue;
			var status = 0;
			if(this.shopIds!=null && this.shopIds!=""){
					if(value){
					if(this.shopName != "选择门店" && this.shopIds!=null && this.shopIds!=""){
						var url = '/app/voice/setting.do?status=1&id='+this.settingId+'&shopId='+this.shopIds+'&shopName='+this.storeName;
					this.ajaxSetting(url);
					}
				}else{
					var url = '/app/voice/setting.do?status=0&id='+this.settingId+'&shopId='+this.shopIds+'&shopName='+this.storeName;
					this.ajaxSetting(url);
				}
			}

  	},
    linkTo() {
			jsBridge.openWindow({
				url: config.bmwServiceUrl+'index.html#/commonProblem?'+window.APP.urlParam,
				target: 'server',
				needTitle:true
			});
    },
    handleBack(){
		jsBridge.closeWindow();
	},
    chooseShopTo(){
    	if(this.roleName != ""){ //为店长，不为空
    		return false;
    	}
    	var ids = [];
    	if(this.switchValue){
    		ids.push(this.shopId);
    	}
		this.$refs.StoreChoice.popupShow(ids)
    },
    testVoiceBroadcast(){
			var _this = this;
   	if(this.isClick==0){
				this.isClick = 1;
				setTimeout(function(){
					_this.isClick = 0;
				},5000);
				jsBridge.testVoiceBroadcast({text:'支付宝或微信成功收款1元'});
			}else{
				return;
			}
    },
    callBack(value,storeName){
    	var shopId = value[0].selectKey;
    	this.shopName = storeName;
    	this.storeName = storeName;
			this.shopId = shopId;
				this.shopIds = shopId;
    	var status = this.switchValue ? "1" : "0";
	    var url = '/app/voice/setting.do?shopId='+shopId+'&shopName='+storeName+'&status='+status+'&id='+this.settingId;
	    this.ajaxSetting(url);
    },
    ajaxSetting(url){
    	this.ajax({
          url:  url,
          type: 'get',
          controlLoading: true,
		}).then(function(res){
        	if(res != null && (res.success == "true" || res.success)){
				Toast("设置成功");
			}else{
				if(res.code == "301"){
					Toast(res.msg);
				}else{
					Toast("设置失败");
				}
			}
	    })
	    .catch(function(err){

	    })
    }
  },
  components: {
    customHeader,StoreChoice,
  },
  created:function(){
  	var self = this;
  	this.ajax({
          url:  '/app/voice/status.do',
          type: 'get',
          controlLoading: false,
		}).then(function(res){
			if(res != null && res.success){
				var shop = res.resultObject;
				if(shop.roleName != null && shop.roleName != undefined){//店长
					if(shop.status == "1"){
						self.switchValue = true;
					}
					self.shopName = shop.shopName;
					self.storeName = shop.shopName;
					self.shopIds = shop.shopId || "";
					self.roleName = shop.roleName;
					self.isShow = false;
				}else{
					if(shop.status == "1"){
						self.switchValue = true;
						self.shopName = shop.shopName;
						self.shopId = shop.shopId || "";
					}
					self.storeName = shop.shopName;
					self.settingId = shop.id || "";
					self.shopIds = shop.shopId || "";
				}
			}else{

			}
	    })
	    .catch(function(err){

	    })
  },
  mounted() {
	  this.checkVoiceTest();
  },
};
</script>
<style lang='scss' scoped>
@import "voice";
</style>
<style lang="scss">
.voice {
	.mint-switch-input:checked + .mint-switch-core {
		background-color: #FF211A;
		border-color: #FF211A;
	}
}
</style>